<template>
  <div>
    <el-tree
      :data="data.list"
      show-checkbox
      :check-strictly="true"
      node-key="roleId"
      :default-checked-keys="data.authority"
      :props="{
        children: 'roleList',
        label: 'name'
      }"
    />
  </div>
  <el-button @click="changeAuthority">确认修改</el-button>
</template>

<script lang="ts" setup>
import { getAuthorityList } from '@/request/api'
import { InitData } from '@/type/authority'
import { onMounted, reactive } from 'vue'
import { useRoute } from 'vue-router'

const route = useRoute()
const params: any = route.query
const data = reactive(new InitData(params.id, params.authority.split(',')))

onMounted(() => {
  getAuthority()
})

const getAuthority = () => {
  getAuthorityList()
    .then((res) => {
      data.list = res.data
    })
    .catch(() => {})
}

const changeAuthority = () => {}
</script>
